<template>
    <ynet-content id="accMaintain" :headerInformation="true" :headerMenu="true" class="main-container">
        <div ><!--提示当前位置  账户维护-->
			<ynet-breadcrumb></ynet-breadcrumb>
		</div>
        <div  v-if="main">
            <div>
                <el-form ref="queryForm" :model="queryForm" class="formEmbedTable mt20" :rules="rules">
                    <table>
                        <caption>Enquiry</caption>
                        <tr>
                            <td>TBS A/C No</td>
                            <td>
                                <el-form-item prop="primaryAcc">
                                    <el-input v-model="queryForm.primaryAcc"></el-input>
                                </el-form-item>
                            </td>		
                        </tr>
                    </table>
                </el-form>
            </div>
            <div class="btnArea mt20 tac">
                <el-button type="primary" @click="queryPrimaryInfo('queryForm')">Search</el-button>
                <el-button type="primary" @click="systemAdd">Add</el-button>
            </div>
            <div>
                <el-form ref="returnDate" :model="returnDate" class="formEmbedTable mt20">
                    <table>
                        <tr>
                            <td>Primary A/C No</td>
                            <td>
                                <el-form-item prop="primaryAcc">
                                    <el-input v-model="returnDate.primaryAcc" :disabled="true"></el-input>
                                </el-form-item>
                            </td>	
                            <td>A/C Type</td>
                            <td>
                                <el-form-item prop="accType">
                                    <el-input v-model="returnDate.accType" :disabled="true"></el-input>
                                </el-form-item>
                            </td>	
                        </tr>
                    </table>
                </el-form>
            </div>
            <br></br>

            <el-tabs v-model="activeName" @tab-click="handleClick" type="border-card">
                <!--活期账号-->
                <el-tab-pane label="Bank A/C No." name="first">
                    <div class="fourForm tableForm mt20 tableData">
                        <el-table :data="currentList" border>
                            <el-table-column label="TBS A/C No" prop="accNo" align="center"></el-table-column>
                            <el-table-column label="A/C Type" prop="accType" align="center"></el-table-column>
                            <el-table-column label="Action" prop="Action" align="center">
                                <template scope="scope">
                                    <a class="cBlue" @click="currentDeleteConfirm(scope.row.accNo)">Delete</a>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                    <div class="pagination tar mt20">
                        <el-pagination  @current-change="handleCurrentChange" :current-page="Number(currentPage)" :page-size="Number(turnPageShowNum)" layout="total, prev, pager, next, jumper" :total="Number(turnPageTotalNum)">
                        </el-pagination>
                    </div>
                    <div class="btnArea mt20 tac">
                        <el-button type="primary" @click="currentAdd">Add</el-button>
                        <el-button type="primary" @click="contactsModify">Modify contacts</el-button>
                    </div>
                </el-tab-pane>
                <!--活期账号--END-->
                <!--定期账号-->
                <el-tab-pane label="Fixed Deposit A/C No." name="second">
                    <div class="fourForm tableForm mt20 tableData">
                        <el-table :data="depositList" border>
                            <el-table-column label="TBS A/C No" prop="accNo" align="center"></el-table-column>
                            <el-table-column label="Action" prop="Action" align="center">
                                <template scope="scope">
                                    <a class="cBlue" @click="depositDeleteConfirm(scope.row.accNo)">Delete</a>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                    <div class="pagination tar mt20">
                        <el-pagination  @current-change="handleCurrentChange1" :current-page="Number(currentPage1)" :page-size="Number(turnPageShowNum)" layout="total, prev, pager, next, jumper" :total="Number(turnPageTotalNum1)">
                        </el-pagination>
                    </div>
                    <div class="btnArea mt20 tac">
                        <el-button type="primary" @click="depositAdd">Add</el-button>
                        <el-button type="primary" @click="contactsModify">Modify contacts</el-button>
                    </div>
                </el-tab-pane>
                <!--定期账号 End-->
            </el-tabs>
        </div>
        <!--修改区域-->   
             
        <div v-if="isAdd">
            <systemAdd :toPrimaryAcc="toPrimaryAcc" :toAccoType="toAccoType" :toUserNo="toUserNo" @back="back"></systemAdd>
        </div>
        <div v-if="isModify">
            <modifyContact :toPrimaryAcc="toPrimaryAcc" :toContacts="toContacts"  @back="modifyBack"></modifyContact>
        </div>   
        <!--删除提交确认-->
          <el-dialog :visible.sync="dialogVisible" size=tiny class="money tac">
              <span style="font-size:16px;">Are you sure you want to delete this account ?</span>
              <div slot="footer" class="dialog-footer">
                  <el-button @click="dialogVisible = false">Cancel</el-button>
                  <el-button type="primary" @click="dialogVisible = false;queryAuth()">Confirm</el-button>
              </div>
          </el-dialog>
       <!--删除提交确认 end--> 
       <!--删除提交确认-->
          <el-dialog :visible.sync="dialogVisible2" size=tiny class="money tac">
              <span style="font-size:16px;">Are you sure you want to delete this account ?</span>
              <div slot="footer" class="dialog-footer">
                  <el-button @click="dialogVisible2 = false">Cancel</el-button>
                  <el-button type="primary" @click="dialogVisible2 = false;queryAuth()">Confirm</el-button>
              </div>
          </el-dialog>
       <!--删除提交确认 end--> 

       <!--成功-->
      <el-dialog :visible.sync="deleteDialogVisible" size=tiny class="tac" :close-on-click-modal="false" :close-on-press-escape="false">
           <div class="tableForm mt20">
              <div class="transactionStatus">
                <ynet-icon Type="transactionStatus" NO="1"></ynet-icon>
                <span class="ml15">Successful operation</span>
              </div>
              <div class="btnArea mt20 tac">
                  <el-button type="primary" @click="deleteDialogVisible = false,deleteConfimEnter()">Confirm</el-button>
              </div>
          </div> 
      </el-dialog>
      <!--成功-->

      <!--授权确认页面弹窗-->
        <div>
            <ynet-authDialog ref="dialogTable"  @getAuthForm="getAuthForm"></ynet-authDialog>
        </div>

      
        
    </ynet-content>
</template>

<script>
    import systemAdd from './components/systemAdd';
    import modifyContact from './components/modifyContact';
	export default {
		name:'accMaintain',
		components:{
          systemAdd,
          modifyContact,
		},
		data(){
            return { 
                main:true,
                turnPageTotalNum:'',
                turnPageTotalNum1:'',
                currentPage:'1',
                currentPage1:'1',
                turnPageShowNum:'10',
                dialogVisible:false,
                dialogVisible2:false,
                dialogTableVisible:false,
                deleteDialogVisible:false,
                isAdd:false,
                isModify:false,
                delTypeFlag:'',
                currentList:[],//从后台查询到活期账号集合
                depositList:[],//从后台查询到定期账号集合
                index1:'',
                index2:'',
                activeName:'first',
                rules:{
                    primaryAcc:[
                        {validator:this.validatorPrimaryAcc, trigger:'blur'},
                    ],
                },
                editData:{},
                queryForm:{
                    primaryAcc:''
                },
                returnDate:{
                    primaryAcc:'',
                    accType:''
                },
                toPrimaryAcc:'',
                toContacts:'',
                toAccoType:'',
                toUserNo:'',
                needAuth:'',
                authType:'',
                authForm: { authUserNo: '', password: '',randomField:''},

            }   
        },
		methods:{ 
            handleClick(tab, event) {
                //console.log(tab, event)
            },
            handleCurrentChange(val) {//查询分页方法
                this.queryForm.currentPage=val;
                this.queryCurrentList()
            },
            handleCurrentChange1(val) {//查询分页方法
                this.queryForm.currentPage1=val;
                this.queryCurrentList()
            },
           resetForm(formName){
                this.$refs[formName].resetFields();
           },
           getAuthForm(val){
                //获取授权数据
                this.authForm.authUserNo = val.authUserNo
                this.authForm.password = val.password
                this.authForm.randomField = val.randomField
                if(this.delTypeFlag == 'currentFlag'){
                    this.currentDelete()
                }
                if(this.delTypeFlag == 'depositFlag'){
                    this.depositDelete()
                }
            },
   
           currentDeleteConfirm(val){
            //  主账号不能删除
                this.index1 = val
                this.delTypeFlag = 'currentFlag'
                this.dialogVisible = true
           },
           depositDeleteConfirm(val){
               //  主账号不能删除
                this.index2 = val
                this.delTypeFlag = 'depositFlag'
                this.dialogVisible2 = true
           },
           queryAuth(){//查询授权模式
                let body={};body.bsnCode="IM040201";body.version="IM040201",
                this.$tools.request(this,"IM010001Action.do",body).then(data=>{
                    if(data.body.errorCode==0){
                        if(data.body.needAuth==0){//无需授权
                            this.needAuth=0;
                            if(this.delTypeFlag == 'currentFlag'){
                                this.currentDelete()
                            }
                            if(this.delTypeFlag == 'depositFlag'){
                                this.depositDelete()
                            }
                            
                        }else if(data.body.needAuth==1 && data.body.authType==1){  // 临桂式授权
                            this.needAuth=1;
                            this.authType=1;
                            this.$refs["dialogTable"].show()
                            
                            // this.$refs["dialogTable"].show()
                        }else if( data.body.needAuth==1 && data.body.authType==2 ){   //一录一审
                            this.needAuth=1;
                            this.authType=2;
                            if(this.delTypeFlag == 'currentFlag'){
                                this.currentDelete()
                            }
                            if(this.delTypeFlag == 'depositFlag'){
                                this.depositDelete()
                            }
                        }
                    }else{
                        this.$alert("System Error",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })   
			},
           currentDelete(){//活期账号删除
               let requestData = {}
                requestData.queryAcc = this.queryForm.primaryAcc
                this.$tools.request(this,"IM080211Action.do",requestData).then(data=>{   //判断此账号是否在审核中
                    if(data.body.errorCode == '0'){
                        if('1' == data.body.responseFlag){
                            this.$alert('This account is subject to authorization information and cannot be operated !',{
                                confirmButtonText: 'Confirm',
                                callback: action => {
                                }
                            })
                        }else if('0' == data.body.responseFlag){
                            let queryData = {}
                            queryData.reqTP = 'D'
                            queryData.accSubType = 'P'  //活期账号
                            queryData.relateAcc = this.index1
                            queryData.primaryAcc = this.returnDate.primaryAcc
                            queryData.accType = this.returnDate.accType
                            queryData.actionType = '2'
                            queryData.bsnCode = 'IM040201'
                            if(this.needAuth==1 && this.authType==1){
                                queryData=$.extend(queryData,this.authForm)
                            }
                            this.$tools.request(this,"IM080202.do",queryData).then(data=>{

                                if(data.body.errorCode==0){
                                    if(this.needAuth==1 && this.authType==2){
                                        this.$message({
                                            type:'success',
                                            message:'Waiting for Authorized'
                                        })
                                        
                                    } else if(this.needAuth==1 && this.authType==1){
                                        if(data.body.authStatus==1){
                                            this.$message({
                                                type:'warning',
                                                message:'Authorship No. or password wrong ,please resume load',
                                                showClose:true,
                                            })
                                           
                                        }else{
                                            this.$message({
                                                type:'success',
                                                message:'delete Success',
                                                showClose:true,
                                            })
                                            this.deleteConfimEnter()
                                            
                                        }
                                    }else{
                                        this.$message({
                                            type:'success',
                                            message:'Add Success',
                                            showClose:true,
                                        })
                                        this.deleteConfimEnter()
                                    }
                                } else{
                                    this.$alert("System Error Try again", "warning",{
                                            confirmButtonText: 'Confirm',
                                            callback: action => {
                                            }
                                        })
                                }
                            })
                        }
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })


               
           },
           
           depositDelete(){//定期账号删除

               let requestData = {}
                requestData.queryAcc = this.queryForm.primaryAcc
                this.$tools.request(this,"IM080211Action.do",requestData).then(data=>{   //判断此账号是否在审核中
                    if(data.body.errorCode == '0'){
                        if('1' == data.body.responseFlag){
                            this.$alert('This account is subject to authorization information and cannot be operated !',{
                                confirmButtonText: 'Confirm',
                                callback: action => {
                                }
                            })
                        }else if('0' == data.body.responseFlag){
                            let queryData = {}
                            queryData.reqTP = 'D'
                            queryData.accSubType = 'S'   //定期账号
                            queryData.relateAcc = this.index2
                            queryData.primaryAcc = this.returnDate.primaryAcc
                            queryData.accType = this.returnDate.accType
                            queryData.actionType = '2'
                            queryData.bsnCode = 'IM040201'
                            this.$tools.request(this,"IM080202.do",queryData).then(data=>{
                               
                                if(data.body.errorCode==0){
                                    if(this.needAuth==1 && this.authType==2){
                                        this.$message({
                                            type:'success',
                                            message:'Waiting for Authorized'
                                        })
                                        
                                    } else if(this.needAuth==1 && this.authType==1){
                                        if(data.body.authStatus==1){
                                            this.$message({
                                                type:'warning',
                                                message:'Authorship No. or password wrong ,please resume load',
                                                showClose:true,
                                            })
                                        }else{
                                            this.$message({
                                                type:'success',
                                                message:'delete Success',
                                                showClose:true,
                                            })
                                            this.deleteConfimEnter()
                                        }
                                    } else{
                                        this.$message({
                                            type:'success',
                                            message:'Add Success',
                                            showClose:true,
                                        })
                                        this.deleteConfimEnter()
                                    }
                                } else{
                                    this.$alert("System Error Try again", "warning",{
                                            confirmButtonText: 'Confirm',
                                            callback: action => {
                                            }
                                        })
                                }
                            })
                        }
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })

               
           },
           contactsModify(){
               this.main=false;
               this.isModify=true;
           },
           systemAdd(){//点击新增按钮,显示新增页面
                if('' == this.queryForm.primaryAcc) {
                    this.$alert('Please enter phone bank account first !',{
                        confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                    })
                    return
                }

                let requestData = {}
                requestData.queryAcc = this.queryForm.primaryAcc
                this.$tools.request(this,"IM080211Action.do",requestData).then(data=>{    //判断此账号是否在审核中
                    if(data.body.errorCode == '0'){
                        if('1' == data.body.responseFlag){
                            this.$alert('This account is subject to authorization information and cannot be operated !',{
                                confirmButtonText: 'Confirm',
                                callback: action => {
                                }
                            })
                        }else if('0' == data.body.responseFlag){
                            let queryData = {}
                            queryData.reqTP = 'E'
                            queryData.primaryAcc = this.queryForm.primaryAcc
                            this.$tools.request(this,"IM080201.do",queryData).then(data=>{ //查询数据库中是否存在此主账号
                                if(data.body.errorCode == '0'){
                                    if('N' == data.body.queryFlag){
                                        this.$alert('No phone bank account exists !',{
                                            confirmButtonText: 'Confirm',
                                            callback: action => {
                                            }
                                        })
                                    }else if('Y' == data.body.queryFlag){
                                        this.toAccoType = ''
                                        this.main=false;
                                        this.isAdd=true;
                                    }
                                }else{
                                    this.$alert("System Error Try again", "warning",{
                                        confirmButtonText: 'Confirm',
                                        callback: action => {
                                        }
                                    })
                                } 
                            })
                        }
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })

                
 
           },
        //    updateSystem(val){//点击修改按钮,反显选中的数据
        //         console.log("updatval:"+JSON.stringify(val))
        //         this.editData=$.extend({},this.editData,val)
        //         this.main=false;
        //         this.isAdd=false;
        //    },
           queryPrimaryInfo(){
               this.$refs.queryForm.validate((valid)  => {
                  if(valid){

                        // 查询主账号的货期定期之前需要判断主账号是否在带审核，是？ 不能查询

                        let queryData = {}
                        queryData.reqTP = 'Q'
                        queryData.primaryAcc = this.queryForm.primaryAcc
                        this.$tools.request(this,"IM080201.do",queryData).then(data=>{
                        console.log("data:"+JSON.stringify(data))
                        if(data.body.errorCode == '0'){
                                this.returnDate.primaryAcc = this.queryForm.primaryAcc;
                                this.toPrimaryAcc = this.returnDate.primaryAcc
                                this.toContacts = data.body.authPerson //密码函接收人
                                this.toUserNo = data.body.userNo //密码函接收人
                                // this.queryForm.primaryAcc = ''
                                this.returnDate.accType = data.body.ACtype;
                                this.currentList = data.body.currentAccList;
                                this.depositList = data.body.depositAccList;
                        }else{
                            this.$alert("System Error Try again", "warning",{
                                    confirmButtonText: 'Confirm',
                                    callback: action => {
                                    }
                                })
                        }
                    })
                  }

            })
           },

           //电话银行主账号校验
           validatorPrimaryAcc(rule, value, callback){
                let _this = this
                if("" == value || undefined == value) return callback("Please input account number !")
                if(!(/^[0-9]*$/.test(value))){
                    return callback("Please enter the correct format of the account !") 
                }
                callback()
            },
            deleteConfimEnter(){
                let _this = this
                setTimeout(function(){
                    _this.queryPrimaryInfo()
                },500)
            },
        //    query(val){//查询频率控制
        //         //console.log("val:"+JSON.stringify(val))
        //         this.queryForm.currentPage=1
        //         console.log("queryForm:"+JSON.stringify(this.queryForm))
        //         this.queryCurrentList()
        //     },
            back(){
                this.main=true;
                this.isAdd=false;
                // this.queryCurrentList();
            },
            currentAdd(){
                this.toAccoType = 'P'
                this.main=false;
                this.isAdd=true;
                
            },
            depositAdd(){
                this.toAccoType = 'S'
                this.main=false;
                this.isAdd=true;
            },
            modifyBack(){
                let _this = this
                _this.main=true;
                _this.isModify=false;
                setTimeout(function(){
                    _this.queryPrimaryInfo()
                },500)
                // this.queryCurrentList();
            },
            
            
		}
	}
</script>